<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/include/taglibs.jsp" %>
<html>
<head>
    <%@include file="/include/header.html" %>
    <script type="text/javascript" src="${ctx}/appjs/order/orderInfo/orderInfo.js"></script>
    <link rel="stylesheet" href="${ctx}/statics/css/update.css">
    <link rel="stylesheet" href="${ctx}/statics/css/common.css">
    <style>
        /*.fixed-table-pagination,.fixed-table-header,.fixed-table-toolbar{*/
        /*position: fixed;*/
        /*}*/
        /*.fixed-table-body{*/
        /*padding-top: 50px;*/
        /*}*/
        /*.bootstrap-table .fixed-table-container.fixed-height .fixed-table-border{*/
        /*border: none;*/
        /*}*/
        .fixed-table-border {
            height: auto !important;
        }

        .fixed-table-header {
            margin-right: 0 !important;
        }
    </style>
</head>

<script type="text/javascript">
    $('#topLink', window.parent.document).html(function (i, origText) {
        return '<ol class="breadcrumb">' +
            '<li class="breadcrumb-item">' +
            '<a href="">主页</a>' +
            '</li>' +
            '<li class="breadcrumb-item">' +
            '<a>订单管理</a>' +
            '</li>' +
            '<li class="breadcrumb-item">' +
            '<a>订单列表</a>' +
            '</li>' +
            '<li class="breadcrumb-item">' +
            '<a>订单详情</a>' +
            '<li class="breadcrumb-item">' +
            '<a href="javascript:window.history.back()"><i class="fa fa-times"></i> 返回</a>' +
            '</li>' +
            '</li>' +
            '</ol>';
    });
</script>

<body class="gray-bg orderContentBody">
<div class="wrapper wrapper-content ">
    <div class="row">
    <div class="col-sm-12">
        <div class="ibox float-e-margins">
            <div class="ibox-title">
                <div class="columns pull-left">
                    <h5 class="font-bold">订单详情</h5>
                </div>
                <div class="ibox-tools">
                    <a class="close-link">
                        <i class="fa fa-times"></i>
                    </a>
                </div>
            </div>

            <div class="ibox-content">
                <form class="form-horizontal m-t" >
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">订单编号</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control" id="orderNumId"   readonly
                                   value="${info.outOrderNum}">

                        </div>
                        <label class="col-sm-1 col-form-label text-right">订单状态</label>
                        <div class="col-sm-2">
                            <select class="form-control" placeholder="" disabled>
                                <option value="0" <c:if test="${info.status == '0'}">selected</c:if>>未充电</option>
                                <option value="1" <c:if test="${info.status == '1'}">selected</c:if>>充电中</option>
                                <option value="2" <c:if test="${info.status == '2'}">selected</c:if>>已结束充电</option>
                                <option value="3" <c:if test="${info.status == '3'}">selected</c:if>>充电结算中</option>
                                <option value="4" <c:if test="${info.status == '4'}">selected</c:if>>占位费结算</option>
                                <option value="5" <c:if test="${info.status == '5'}">selected</c:if>>占位中</option>
                                <option value="6" <c:if test="${info.status == '6'}">selected</c:if>>待结算状态</option>
                            </select>
                        </div>
                        <label class="col-sm-1 col-form-label text-right">交易流水号</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.inTradeNo}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">充电日期</label>
                        <div class="col-sm-2">
                            <%--<input type="text" class="form-control"   readonly
                                   value="${info.chargeDate}"> --%>
                            <input type="text" class="form-control"
                                   value="<fmt:formatDate value="${info.chargeDate}" pattern="yyyy-MM-dd" />" readonly>
                        </div>
                        <label class="col-sm-1 col-form-label text-right">充电枪编号</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.gunNo}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">站点名称</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.stationName}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">所属加盟商</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.operatorName}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">用户名</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.nickname}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">手机号</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.mobile}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">车牌</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.carNum}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">充电方式</label>
                        <div class="col-sm-2">
                           <%-- <input type="text" class="form-control"  readonly
                                   value="${info.accountType}">--%>
                            <select class="form-control" placeholder="" disabled>
                                <option value="0" <c:if test="${info.chargingPolicy == '0'}">selected</c:if>>自动充满</option>
                                <option value="1" <c:if test="${info.chargingPolicy == '1'}">selected</c:if>>按时间充满</option>
                                <option value="2" <c:if test="${info.chargingPolicy == '2'}">selected</c:if>>定金额</option>
                                <option value="3" <c:if test="${info.chargingPolicy == '2'}">selected</c:if>>按电量充满</option>
                            </select>
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">开始时间</label>
                        <div class="col-sm-2">
                            <%--<input type="text" class="form-control"   readonly
                                   value="${info.startTime}">--%>
                            <input type="text" class="form-control"
                                    value="<fmt:formatDate value="${info.startTime}" pattern="yyyy-MM-dd HH:mm:ss" />" readonly>
                        </div>
                        <label class="col-sm-1 col-form-label text-right">结束时间</label>
                        <div class="col-sm-2">
                            <%--<input type="text" class="form-control"  readonly
                                   value="${info.endTime}">--%>
                            <input type="text" class="form-control"
                                value="<fmt:formatDate value="${info.endTime}" pattern="yyyy-MM-dd HH:mm:ss" />" readonly>
                        </div>
                        <label class="col-sm-1 col-form-label text-right">充电时长</label>
                        <div class="col-sm-2">
                            <%--<input type="text" class="form-control"  readonly
                                   value="${info.timeStr}">--%>
                                <input type="text" class="form-control"   readonly
                                       value="${info.timeStr}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">充电开始SOC</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.beginSoc}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">充电结束SOC</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.soc}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">电量（度）</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.totalPower}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">订单金额</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.totalMoney}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">电费（元）</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.totalElecMoney}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">服务费（元）</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.totalSeviceMoney}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">占桩费（元）</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.occupyAmount}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">优惠金额</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.discountAmount}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">优惠方式</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.discountName}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">实付金额</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.payAmount}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">支付时间</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"
                            value="<fmt:formatDate value="${info.occupyPayTime}" pattern="yyyy-MM-dd HH:mm:ss" />" readonly>
                            <%--<input type="text" class="form-control"   readonly
                                   value="${info.payTime}">--%>
                        </div>
                        <label class="col-sm-1 col-form-label text-right">支付方式</label>
                        <div class="col-sm-2">
                            <select class="form-control" placeholder="" disabled>
                                <option value="0" <c:if test="${info.accountType == '0'}">selected</c:if>>个人钱包</option>
                                <option value="1" <c:if test="${info.accountType == '1'}">selected</c:if>>企业钱包</option>
                                <option value="2" <c:if test="${info.accountType == '2'}">selected</c:if>>共享余额</option>
                                <option value="3" <c:if test="${info.accountType == '3'}">selected</c:if>>先付后退钱包</option>
                            </select>
                        </div>
                        <label class="col-sm-1 col-form-label text-right">充电结束说明</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.stopMsg}">
                        </div>
                    </div>
                    <div class="form-group row" class="col-sm-12">
                        <label class="col-sm-1 col-form-label text-right">预付金额</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"   readonly
                                   value="${info.preAmount}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">退款金额</label>
                        <div class="col-sm-2">
                            <input type="text" class="form-control"  readonly
                                   value="${info.refundAmount}">
                        </div>
                        <label class="col-sm-1 col-form-label text-right">&nbsp;</label>
                        <div class="col-sm-2">&nbsp;</div>
                    </div>
                    <div class="ibox-title">
                        <div class="columns pull-left">
                            <h5 class="font-bold">明细</h5>
                        </div>
                        <div class="ibox-tools">
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>

                    <div class="form-group row col-sm-12" style="overflow-x: auto;overflow-y: auto;width: 1260px;" >
                        <table id="stationPirceId" lay-filter="test"></table>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
</div>
</body>
</html>
<script>
    var oNum = '';
    $(function () {
        var orderNumId = $("#orderNumId").val();
        if (orderNumId!=''&&orderNumId!=undefined){
            oNum = orderNumId;
        }
    });
    layui.use(['table'], function() {
        var  table = layui.table;
        table.render({
            elem: '#stationPirceId',  // 指向页面组件id
            where: { outOrderNum: oNum },  // 传递参数
            url: jsctx + '/orderDetail/getDetailByOrderNum/',  // 异步获取数据
            cellMinWidth: 95,
            page: false,  //
            parseData:function(res){
                //debugger
                //let resData = res.data;
                return {
                    "code": 0,
                    "msg": "",
                    "count": res.length,//解析数据总条数
                    "data": res //解析数据列表
                }
            },
            cols: [[
                {field: '', title: '时间段', width: '500', align: 'center',
                    templet: function(row) {
                        return '<span >'+row.beginTime+'~'+row.endTime+'</span>'
                    }},
                {field: 'elecPrice', title: '电费单价', width: '150', align: 'center'},
                {field: 'servicePrice', title: '服务费单价', width: '150', align: 'center'},
                {field: 'chargeAmount', title: '合计', width: '150', align: 'center'}
            ]]
        });
    });
</script>
